<script setup>
import { ref, reactive, onMounted } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import { getGoodsByIdApi, updateGoodsApi } from '@/api/goods'

const router = useRouter()
const route = useRoute()

const id = route.params.id
console.log(id)

const name = ref('')
const price = ref('')

onMounted(async() => {
    const good = await getGoodsByIdApi(id)
    name.value = good.name
    price.value = good.price
})

const updatadGoods = async() => {
  await updateGoodsApi(id, {
    name: name.value,
    price: price.value
  })
  router.push('/')
}
</script>

<template>
      产品名称:<input type="text" v-model="name"><br/>
      产品价格:<input type="text" v-model="price"><br/>
      <button @click="updatadGoods">更新</button>
</template>

<style scoped>

</style>
